<html>
<head>
  <title>Kudewe Reports</title>
	<!-- Ext includes -->
    <link rel="stylesheet" type="text/css" href="lib/ext-4.0.0/resources/css/ext-all.css" />
    <script type="text/javascript" src="lib/ext-4.0.0/bootstrap.js"></script>
    
	<!-- libs -->
	<script type="text/javascript" src="lib/tibco/pagebus.js"></script>
	<script type="text/javascript" src="lib/ui/buildDashBoard.js"></script>
	<script type="text/javascript" src="lib/ui/buildView.js"></script>
	<script type="text/javascript" src="lib/ui/buildFilter.js"></script>
	<script type="text/javascript" src="lib/ui/PortalPanel.js"></script>
    <script type="text/javascript" src="lib/ui/PortalDropZone.js"></script>
    <script type="text/javascript" src="lib/ui/PortalColumn.js"></script>
    <script type="text/javascript" src="lib/ui/Portlet.js"></script>
	
	<script type="text/javascript">
	Ext.require(['*']);
	Ext.require('Ext.chart.*');
	
    Ext.onReady(function(){

		// Get query string
		var queryString = Ext.urlDecode(window.location.search.substring(1));
		
		// Get dash board definition and build it
		Ext.Ajax.request({
			url: 'metadata/' + queryString.dashBoard + '.json' , 
			params: {},
			method: 'GET',
			success: function (result, request) { 
				var dashBoard = Ext.decode(result.responseText);

				var viewport = new Ext.Viewport({
					layout: 'border',
					items:[{
						region: 'east',
						title: 'Filtros',
						collapsible: true,
						split:true,
						width: 180,
						minSize: 175,
						maxSize: 400,
						margins:'0 5 0 0',
						layout:'anchor',
			            layoutConfig:{
			                animate:true
			            },
						items: buildFilters(dashBoard)
					}, buildDashBoard(dashBoard)
					]
			    });
			},
			failure: function ( result, request) { 
				Ext.MessageBox.alert('Failed', result.responseText); 
			} 
		});

    });
	</script>
</head>
<body>
<div id="panelDebugPagebus"></div>
</body>
</html>
